<template>
  <div class="fly-panel">
    <div class="fly-panel-title fly-filter">
      <a>置顶</a>
      <a href="#signin" class="layui-hide-sm layui-show-xs-block fly-right" id="LAY_goSignin" style="color: #FF5722;">去签到</a>
    </div>
    <list-Item :lists="lists" :isShow="false"></list-Item>
  </div>
</template>

<script>
import ListItem from '@/components/contents/ListItem'
import { getList } from '@/api/content'
export default {
  name: 'top',
  data () {
    return {
      status: '',
      tag: '',
      sort: 'created',
      page: 0,
      limit: 5,
      isRepeat: false,
      current: '',
      lists: [
      ]
    }
  },
  components: {
    ListItem
  },
  mounted () {
    this._getLists()
  },
  methods: {
    _getLists () {
      if (this.isRepeat) return
      this.isRepeat = true
      const options = {
        catalog: this.catalog,
        isTop: true,
        page: this.page,
        limit: this.limit,
        sort: this.sort,
        tag: this.tag,
        status: this.status
      }
      getList(options).then((res) => {
        // 加入一个请求锁，防止用户多次点击，等待数据返回后，再打开
        this.isRepeat = false
        console.log(res)
        // 对于异常的判断，res.code 非200，我们给用户一个提示
        // 判断是否lists长度为0，如果为零即可以直接赋值
        // 当Lists长度不为0，后面请求的数据，加入到Lists里面来
        if (res.code === 200) {
          // 判断res.data的长度，如果小于20条，则是最后页
          if (res.data.length < this.limit) {
            this.isEnd = true
          }

          if (this.lists.length === 0) {
            this.lists = res.data
          } else {
            this.lists = this.lists.concat(res.data)
          }
        }
      }).catch((err) => {
        this.isRepeat = false
        if (err) {
          this.$alert(err.message)
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
</style>
